<template>
<div class="fml-header-box border-b">
    <el-header >
			<div class="fml-header-left flex">
        <div class="fml-bg-header-logo"></div>
			</div>
			<div class="fml-header-right">
		    <el-dropdown  @command="dropDownHandle">
          <span class="el-dropdown-link" style="color:#fff">
            <i class="iconfont icon-yonghu" style="margin-right:10px"></i>{{$store.state.userInfo.name}}<i class="el-icon-caret-bottom el-icon--right"></i>
          </span>
          <el-dropdown-menu slot="dropdown"  style="width:250px !important">
            <el-dropdown-item >退出</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
			</div>
    </el-header>
</div>
</template>
<script lang="ts">
import Vue from 'vue'
export default Vue.extend({
  name: "FmlHeader",
  data() {
    return {
      leftSet: "210px",
    };
  },
  methods: {
    // 下拉数据
    dropDownHandle() {
      this.logout();
    },
    async logout() {
      let url = this.$api.$domain+ "/logout?Authentication=" + this.$store.state.Authentication
      sessionStorage.clear()
      window.location.href=url
    }
  },
  mounted(){
  }
})
</script>
<style lang="scss" scoped>
.fml-bg-header-logo {
  width: 345px;
  height: 44px;
  display: inline-block;
  vertical-align: middle;
  margin-right:11px;
  background: url("../static/logo_kj.png") center center no-repeat;
  background-size: 100%;
}
.el-aside {
  color: #333;
}
.fml-pwdStrong .el-form-item__label {
  line-height: 20px;
}
// 9-17
.fml-header-box {
  height: 61px;
  font-size: $mainFontSize;
  background: $mainColor url("../static/top_bg.png") center center no-repeat;
  background-size: 100%;
}
.el-dropdown {
  color: $headerFontColor;
  cursor: pointer;
}
.fml-user-logo {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: inline-block;
  vertical-align: middle;
  margin-right: 14px;
}
</style>


